<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<script type="text/javascript" src="/${initParam.context_root }/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
</script>
<div id="Container">
<div id="hotContainer" align="center" style="width: 100%">
<div>
<hr><h2 style="width: 100%; background-color: yellow;">Hot 상품</h2><hr>
</div>
<div id="hot1" style="float: left; width: 25%"  onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byReadCnt[0].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
			<c:choose>
			<c:when test="${not empty requestScope.list.byReadCnt[0].productImageFilename }">
				${requestScope.list.byReadCnt[0].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
			</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byReadCnt[0].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byReadCnt[0].productImageFilename}" width="150" height="120" style="cursor:hand;" >
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byReadCnt[0].originalPrice}원</strike><br>${requestScope.list.byReadCnt[0].reducedPrice}원 => <font color="red">${requestScope.list.byReadCnt[0].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
<div id="hot2" style="float: left ; width: 25%" onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byReadCnt[1].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
		<c:choose>
			<c:when test="${not empty requestScope.list.byReadCnt[1].productName}">
				${requestScope.list.byReadCnt[1].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
		</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byReadCnt[1].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byReadCnt[1].productImageFilename}"  width="150" height="120">
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byReadCnt[1].originalPrice}원</strike><br>${requestScope.list.byReadCnt[1].reducedPrice}원 => <font color="red">${requestScope.list.byReadCnt[1].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
<div id="hot3" style="float :left ; width: 25%" onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byReadCnt[2].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
		<c:choose>
			<c:when test="${not empty requestScope.list.byReadCnt[2].productName}">
				${requestScope.list.byReadCnt[2].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
		</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byReadCnt[2].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byReadCnt[2].productImageFilename}" width="150" height="120">
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byReadCnt[2].originalPrice}원</strike><br>${requestScope.list.byReadCnt[2].reducedPrice}원 => <font color="red">${requestScope.list.byReadCnt[2].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
<div id="hot4" style="float :left ; width: 25%" onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byReadCnt[3].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
		<c:choose>
			<c:when test="${not empty requestScope.list.byReadCnt[3].productName}">
				${requestScope.list.byReadCnt[3].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
		</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byReadCnt[3].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byReadCnt[3].productImageFilename}" width="150" height="120">
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byReadCnt[3].originalPrice}원</strike><br>${requestScope.list.byReadCnt[3].reducedPrice}원 => <font color="red">${requestScope.list.byReadCnt[3].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
</div>

<div id="latelyContainer" align="center" style="width: 100%;" >
<div>
<hr><h2 style="float:none ;width:100%; background-color:orange;">오늘의 상품</h2><hr>
</div>
<div id="lately1" style="float :left ; width: 25%" onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byLately[0].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
		<c:choose>
			<c:when test="${not empty requestScope.list.byLately[0].productName}">
				${requestScope.list.byLately[0].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
		</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byLately[0].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byLately[0].productImageFilename}" width="150" height="120">
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byLately[0].originalPrice}원</strike><br>${requestScope.list.byLately[0].reducedPrice}원 => <font color="red">${requestScope.list.byLately[0].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
<div id="lately2" style="float :left ; width: 25%" onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byLately[1].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
		<c:choose>
			<c:when test="${not empty requestScope.list.byLately[1].productName}">
				${requestScope.list.byLately[1].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
		</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byLately[1].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byLately[1].productImageFilename}" width="150" height="120">
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>		
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byLately[1].originalPrice}원</strike><br>${requestScope.list.byLately[1].reducedPrice}원 => <font color="red">${requestScope.list.byLately[1].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
<div id="lately3" style="float :left ; width: 25%" onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byLately[2].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
		<c:choose>
			<c:when test="${not empty requestScope.list.byLately[2].productName}">
				${requestScope.list.byLately[2].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
		</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byLately[2].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byLately[2].productImageFilename}" width="150" height="120">
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byLately[2].originalPrice}원</strike><br>${requestScope.list.byLately[2].reducedPrice}원 => <font color="red">${requestScope.list.byLately[2].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
<div id="lately4" style="float :left ; width: 25%" onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byLately[3].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
		<c:choose>
			<c:when test="${not empty requestScope.list.byLately[3].productName}">
				${requestScope.list.byLately[3].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
		</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byLately[3].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byLately[3].productImageFilename}" width="150" height="120">
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byLately[3].originalPrice}원</strike><br>${requestScope.list.byLately[3].reducedPrice}원 => <font color="red">${requestScope.list.byLately[3].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
</div>

<div id="rateContainer" align="center" style="width: 100%" >
<div>
<hr><h2 style="float:none ;width:100%; background-color:green;">대박 할인</h2><hr>
</div>
<div id="rate1" style="float :left ; width: 25%" onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byRate[0].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
		<c:choose>
			<c:when test="${not empty requestScope.list.byRate[0].productName}">
				${requestScope.list.byRate[0].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
		</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byRate[0].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byRate[0].productImageFilename}" width="150" height="120">
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byRate[0].originalPrice}원</strike><br>${requestScope.list.byRate[0].reducedPrice}원 => <font color="red">${requestScope.list.byRate[0].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
<div id="rate2" style="float :left ; width: 25%" onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byRate[1].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
		<c:choose>
			<c:when test="${not empty requestScope.list.byRate[1].productName}">
				${requestScope.list.byRate[1].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
		</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byRate[1].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byRate[1].productImageFilename}" width="150" height="120">
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>		
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byRate[1].originalPrice}원</strike><br>${requestScope.list.byRate[1].reducedPrice}원 => <font color="red">${requestScope.list.byRate[1].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
<div id="rate3" style="float :left ; width: 25%" onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byRate[2].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
		<c:choose>
			<c:when test="${not empty requestScope.list.byRate[2].productName}">
				${requestScope.list.byRate[2].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
		</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byRate[2].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byRate[2].productImageFilename}" width="150" height="120">
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byRate[2].originalPrice}원</strike><br>${requestScope.list.byRate[2].reducedPrice}원 => <font color="red">${requestScope.list.byRate[2].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
<div id="rate4" style="float :left ; width: 25%" onclick="location.href='/${initParam.context_root }/product_detail.do?productId=${requestScope.list.byRate[3].productId}'">
<table border="1" style="cursor:pointer;">
	<tr>
		<td>
		<c:choose>
			<c:when test="${not empty requestScope.list.byRate[3].productName}">
				${requestScope.list.byRate[3].productName}
			</c:when>
			<c:otherwise>
				<font color="red">상품이 없습니다</font>
			</c:otherwise>
		</c:choose>
		</td>
	</tr>
	<tr height="120">
		<td width="150">
			<c:choose>
				<c:when test="${not empty requestScope.list.byRate[3].productImageFilename }">
					<img src="/${initParam.context_root }/upfile/${requestScope.list.byRate[3].productImageFilename}" width="150" height="120">
				</c:when>
				<c:otherwise>
					<font color="red" style="width: 150; height: 120">No Image</font>
				</c:otherwise>
			</c:choose>
		</td>
	</tr>
	<tr>
		<td><strike>${requestScope.list.byRate[3].originalPrice}원</strike><br>${requestScope.list.byRate[3].reducedPrice}원 => <font color="red">${requestScope.list.byLately[3].reducedRate}%할인</font></td>
	</tr>
</table>
</div>
</div>
</div>
